<template>
  <div>
    <a-card title="考场记录提交" :bordered="false">
      <a-form :form="form" @submit="handleSubmit">
        <a-row :gutter="24">
          <a-col :span="8">
            <a-form-item label="考试日期">
              <a-date-picker
                v-decorator="['examDate', { rules: [{ required: true, message: '请选择考试日期' }] }]"
                style="width: 100%"
              />
            </a-form-item>
          </a-col>
          <a-col :span="8">
            <a-form-item label="考试时间">
              <a-time-picker
                v-decorator="['examTime', { rules: [{ required: true, message: '请选择考试时间' }] }]"
                style="width: 100%"
                format="HH:mm"
              />
            </a-form-item>
          </a-col>
          <a-col :span="8">
            <a-form-item label="考场编号">
              <a-input
                v-decorator="['roomNo', { rules: [{ required: true, message: '请输入考场编号' }] }]"
                placeholder="请输入考场编号"
              />
            </a-form-item>
          </a-col>
        </a-row>

        <a-row :gutter="24">
          <a-col :span="12">
            <a-form-item label="课程名称">
              <a-input
                v-decorator="['courseName', { rules: [{ required: true, message: '请输入课程名称' }] }]"
                placeholder="请输入课程名称"
              />
            </a-form-item>
          </a-col>
          <a-col :span="12">
            <a-form-item label="班级名称">
              <a-input
                v-decorator="['className', { rules: [{ required: true, message: '请输入班级名称' }] }]"
                placeholder="请输入班级名称"
              />
            </a-form-item>
          </a-col>
        </a-row>

        <a-form-item label="缺考情况">
          <a-textarea
            v-decorator="['absentInfo']"
            placeholder="请输入缺考学生学号、姓名，每行一个"
            :rows="4"
          />
        </a-form-item>

        <a-form-item label="舞弊情况">
          <a-textarea
            v-decorator="['cheatInfo']"
            placeholder="请输入舞弊学生学号、姓名及具体情况，每行一个"
            :rows="4"
          />
        </a-form-item>

        <a-form-item label="其他情况说明">
          <a-textarea
            v-decorator="['otherInfo']"
            placeholder="请输入其他需要说明的情况"
            :rows="4"
          />
        </a-form-item>

        <a-form-item>
          <a-button type="primary" html-type="submit">提交记录</a-button>
          <a-button style="margin-left: 10px" @click="handleReset">重置</a-button>
        </a-form-item>
      </a-form>
    </a-card>
  </div>
</template>

<script>
export default {
  beforeCreate() {
    this.form = this.$form.createForm(this)
  },
  methods: {
    handleSubmit(e) {
      e.preventDefault()
      this.form.validateFields((err, values) => {
        if (!err) {
          console.log('提交的考场记录:', values)
          this.$message.success('考场记录提交成功，等待教务处审核')
          this.form.resetFields()
        }
      })
    },
    handleReset() {
      this.form.resetFields()
    }
  }
}
</script>